<% extends "common/msui.html" %>
<% block title %>地址管理<% endblock %>
<% block body %>
<div class="page" id="address-choose" ms-controller="address">
  <header class="bar bar-nav">
    <a class='button button-link button-nav pull-right' style='margin-right:5px' href='/mshop/customer/address' ><span>管理</span></a>
    <a class="button button-link button-nav pull-left back" href="/mshop/products" >
      <span class="icon icon-left"></span>
      返回
    </a>
    <h1 class="title">地址选择</h1>
  </header>

  <div class="content" >
      <div class="card multi-address" ms-repeat='address' ms-visible='!el.unlink' ms-class='multi-address-choose:el.id == choose_id' ms-click='choose_address(el.id)'>
        <div class="card-content multi-address-content" >
          <div><span>{{el.name}} {{el.phone}}</span> <span ms-visible='el.default' >默认地址</span></div>
          <div><span>{{el.province}}{{el.city}}{{el.country}} {{el.street}}</span></div>
        </div>
      </div>
  </div>

  <footer>
    <nav class="bar bar-tab index-footer">
      <a class="tab-item" href="/mshop?tab=index">
        <span class="icon icon-home"></span>
        <span class="tab-label">首页</span>
      </a>
      <a class="tab-item" href="/mshop?tab=cart">
        <span class="icon icon-cart"></span>
        <span class="tab-label">购物车</span>
      </a>
      <a class="tab-item" href="/mshop?tab=my">
        <span class="icon icon-me"></span>
        <span class="tab-label">我的</span>
      </a>
    </nav>
  </footer>

  <script type="application/javascript" >
    $(function() {
      var partner_id = ${partner_id|safe};
      var choose_id = ${choose_id|safe};
      var order_id = ${order_id|safe};

      var sync_content = function() {
        $.ajax({
          url: '/mshop/customer/address/get_multi',
          data: {partner_id: partner_id},
          type: 'post',
          success: function(e) {
            address_vm.address = JSON.parse(e);
          },
          async: true,
        });
      };

      sync_content()

      var address_vm = avalon.define({
        $id: 'address',
        address: [],
        choose_id: choose_id,
        partner_id: partner_id,
        choose_address: function(id) {
          $.ajax({
            url: '/mshop/customer/address/choosed',
            data: {choose_id: id, order_id: order_id},
            type: 'post',
            success: function(e) {
              window.history.back();
            },
            async: true,
          });
        },
      });

      $(document).on('pageReinit', '#address-choose', function(e, pageId, $page) {
        sync_content();
      });
      
      avalon.scan();
    });


  </script>

<% endblock %>
</div>